
import React, { useEffect, useState } from 'react';
import { observer, useObserver } from 'mobx-react-lite';
import Image from 'next/image'
import { useStore } from '@/store';
import titleUrl from '@/styles/image/title.png'
import From from './From'
import './index.scss'

function AiForm(props: { cb: (status:boolean) => void }) {
  const store = useStore()
  const aiCateConfig=store.cateConfig.aiCateConfig
 
  return (
    <div className='form-contain'>
      <div className='title'>
        <span className='close' onClick={()=>{props.cb(false)}}><i className='iconfont icon-cuowu'></i></span>
        <div className={'title-left'}><Image src={titleUrl} alt=''></Image>
          <div className='cnn'>
            <span className=' font-bold text-r1.6 '>{aiCateConfig.name}</span>
            <span className='bottom'>{aiCateConfig.description}</span>
          </div>
        </div>
      </div>
      <div className=' w-auto h-0 border-t border-gray-D2D1D1  ml-5 mr-5'></div>
      <From cb={function (content: any, edit: any): void {
        throw new Error('Function not implemented.');
      }}></From>
    </div>
  );
}
export default observer(AiForm)

